<template>
	<view class="pagebox">
	
		<view class="numberline">
			No:{{pro.id}}   时间: {{pro.createTime}}
		</view>
		<view class="infobox1">
			<view class="line"></view>
			<view class="info">
				<view class="iteminfo">
					<view class="label">
					昵称:
					</view>
					<view class="value">
						{{pro.memberName||'新用户'}}
					</view>
				   
				</view>
				<view class="iteminfo">
					<view class="label">
						性别:
					</view>
					<view class="value">
						{{pro.memberSex||'性别'}}
					</view>
					
				</view>
				<view class="iteminfo">
					<view class="label">
						年龄:
					</view>
					<view class="value">
						{{pro.memberAge||'年龄'}}
					</view>
					
				</view>
				<view class="iteminfo">
					<view class="label">
						病症:
					</view>
					<view class="value">
						{{pro.memberZhengzhuang||'病症'}}
					</view>
					
				</view>
				<view class="iteminfo">
					<view class="label">
						病程:
					</view>
					<view class="value">
						{{pro.memberBingcheng||'病程'}}
					</view>
					
				</view>
				<view class="iteminfo">
					<view class="label">
						会员等级:
					</view>
					<view class="value">
						{{pro.memberLevel==3?'专病服务':''}}
					</view>
				</view>
				
			</view>
		</view>
		
		<view class="box">
			<view class="itemline">
				<view class="label">
					手机：
				</view>
				<view class="value">
					{{pro.memberPhone}}
				</view>
				
			</view>
			<view class="itemline">
				<view class="label">
					地区：
				</view>
				
					<view class="uni-input">{{pro.memberAddrerss||'地址'}}</view>
									
			
			</view>
			<view class="boxtitle">
				概况：
			</view>
		    <view class="txt"  >{{pro.memberJianjie||''}}</view>
		</view>
		<view class="zhuanjia"  v-if="pro.memberLevel==3">
			<view class="left">
				<view class="imgbox">
					<image :src="'https://changban.dianjingkeji.net'+lingxian[0].hospitalDoctors.dAvatarUrl" mode=""></image>
				</view>
				<view class="title">
					领衔专家
				</view>
			</view>
			<view class="infobox">
				<view class="name">
					{{lingxian[0].hospitalDoctors.dName}}
				</view>
				<view class="labelline">
					{{lingxian[0].hospitalDoctors.dZhicheng}} | {{lingxian[0].hospitalDoctors.dKeshi}}
				</view>
				<view class="typeline">
					<view class="type">
						{{lingxian[0].hospitalDoctors.dTouxian}}
					</view>
					<view class="hospitalname">
						{{lingxian[0].hospitalDoctors.orgName}}
					</view>
				</view>
			</view>
		</view>
		<view class="zhuanjia" v-if="pro.memberLevel==3">
			<view class="left">
				<view class="imgbox">
					<image :src="'https://changban.dianjingkeji.net'+lianxi[0].hospitalDoctors.dAvatarUrl" mode=""></image>
				</view>
				<view class="title1">
					联席专家
				</view>
			</view>
			<view class="infobox">
				<view class="name">
						{{lianxi[0].hospitalDoctors.dName||''}}
				</view>
				<view class="labelline">
						{{lianxi[0].hospitalDoctors.dZhicheng||""}} | {{lianxi[0].hospitalDoctors.dKeshi||""}}
				</view>
				<view class="typeline">
					<view class="type">
						{{lianxi[0].hospitalDoctors.dTouxian||""}}
					</view>
					<view class="hospitalname">
						{{lianxi[0].hospitalDoctors.orgName||""}}
					</view>
				</view>
			</view>
		</view>
		
		
		<view class="teambox" v-if="pro.memberLevel==3">
			<view class="teamtitle">
				团队成员
			</view>
			<view class="teamline">
				<view class="item" v-for="item in shengyu" :key="item.id">
					<view class="yuan">
						<image :src="'https://changban.dianjingkeji.net'+item.hospitalDoctors.dAvatarUrl" mode=""></image>
					</view>
					<view class="work">
					   {{item.tcType==2?'主管医生':item.tcType==3?'主管护士':item.tcType==4?'6X健康管家':''}}
					</view>
				</view>
			
				<view class="item">
					<view class="yuan">
						<image src="https://changban.dianjingkeji.net/img/微信图片_20250923172704_692_133.jpg" mode=""></image>
					</view>
					<view class="work">
					    营养师
					</view>
				</view>
				<view class="item">
					<view class="yuan">
						<image src="https://changban.dianjingkeji.net/img/微信图片_20250923172704_692_133.jpg" mode=""></image>
					</view>
					<view class="work">
					    运动指导师
					</view>
				</view>
			</view>
		</view>
		
		<view class="pagetitle" v-if="pro.memberLevel==3">
			成员列表
		</view>
		<view class="listbox" v-if="pro.memberLevel==3">
			<view class="itemlist" v-for="item in team" :key="item.id">
				<view class="imgbox">
					<image :src="'https://changban.dianjingkeji.net'+item.hospitalDoctors.dAvatarUrl" mode=""></image>
				</view>
				<view class="infobox">
					<view class="nameline">
						<view class="name">
							{{item.hospitalDoctors.dName||''}}
						</view>
						<view class="listtitle">
							{{item.hospitalDoctors.dZhicheng||''}}
						</view>
					</view>
					<view class="hospitalline">
						<view class="hospitalname">
							{{item.hospitalDoctors.orgName||''}}
						</view>
						
					</view>
					<view class="hospitalline">
						<view class="leve" >
							{{item.hospitalDoctors.dTouxian||''}}
						</view>
						
					</view>
					
					<view class="labelline">
						<view class="itemlabel">
							{{item.hospitalDoctors.dKeshi||''}}
						</view>
					</view>
				</view>
				<view class="type">
					{{item.tcType==0?'领衔专家':item.tcType==1?'联席专家':item.tcType==2?'主管医生':item.tcType==3?'主管护士':item.tcType==4?'6X健康管家':''}}
				</view>
			</view>
		</view>
		
		<view class="msgbox" v-if="pro.memberLevel==3">
			<view class="msgboxtitle">
				团队沟通
			</view>
			<view class="msglist">
				<view class="itemmsglist" v-for="item in msglist" :key="item.id">
					<view class="name">
						{{item.hdName}}：
					</view>
					<view class="msgconent">
						{{item.messageInfo}}
					</view>
				</view>
				<input type="text" v-model="message" placeholder="请输入"/>
				<view class="addmsg" @click="addmessage">
					确定
				</view>
			</view>
		</view>
		
<!-- 		<view class="vipbox" >
			<view class="viptitle">
				当前权益
			</view>
			<view class="vipcontentbox">
				<view class="yuan">
					<view class="iconfont icon-fuwu1">
						
					</view>
				</view>
				<view class="contentbox">
					<view class="name">
						专病服务 <view class="lever">
							 年度服务
						</view>
					</view>
					<view class="content">
						享受专家团队一整年的持续健康管理服务，满足长期慢病管理需求，帮助用户长期维持健康状态。
					</view>
					
				</view>
			</view>
		</view> -->

	

	<!-- 	<view class="pagebtn" v-if="isread" @click="changeinfo">
			修改资料
		</view>
		<view class="pagebtn" v-if="!isread" @click="saveinfo">
			保存
		</view> -->
		
		<view class="foottabbar">
			<view class="itemfoot " @click="gonumber" v-if="pro.memberLevel==3">
				数字孪生
			</view>
					<view class="itemfoot">
						数据
					</view>
					<view class="itemfoot" @click="jindu">
						进度
					</view>
					<view class="itemfoot footact" >
						
						用户详情
					</view>
		</view>

		
		
	</view>
</template>

<script>
	import {memberDetail,teamList,addTeamMessage} from '../../utils/api.js'
export default {
  data() {
    return {
		isread:true,
		memberid:'',
		pro:{},
		yifuwu:'',
		shengyu:"",
		team:[],
		lingxian:{},
		lianxi:{},
		shengyu:{},
		msglist:[],
		message:''
		
		
		
    }
  },
  onLoad(e) {
	  this.memberid=e.id
	  let p={
		  phone:uni.getStorageSync('phone'),
		  memberId:e.id
	  }
  	memberDetail(p).then(res=>{
		this.pro=res.data.data
	})
	teamList(p).then(res=>{
	   this.msglist=res.data.data.teamMessage
		this.team= this.sortByType(res.data.data.teamList);
		this.lingxian = res.data.data.teamList.filter(item => item.tcType === 0);
		this.lianxi = res.data.data.teamList.filter(item => item.tcType === 1);
		 this.shengyu = res.data.data.teamList.filter(item => item.tcType !== 0 && item.tcType !== 1);
		 console.log(this.lingxian,this.lianxi,this.shengyu)
	})
  },
 
  methods: {
	  addmessage(){
		  if(this.message==''){
			 uni.showToast({
			 	title: '请先填写留言',
				icon:'none',
			 	duration: 2000
			 }); 
			 return
		  }
		  let that=this
		  uni.showModal({
		  	title: '提示',
		  	content: '确定提交留言吗？',
		  	success: function (res) {
		  		if (res.confirm) {
					console.log(that.lingxian)
		  		let p={
		  				  phone:uni.getStorageSync('phone'),
		  				  memberId:that.memberid,
						  teamId:that.lingxian[0].teamId,
						  content:that.message
		  		}
				 addTeamMessage(p).then(res=>{
					 console.log(res,'添加留言')
					 if(res.data.code==200){
						 uni.showToast({
						 	title: '添加成功',
						 	duration: 2000
						 });
						 that.message=''
						 let p={
						 	  phone:uni.getStorageSync('phone'),
						 	  memberId:that.memberid
						   }
						 memberDetail(p).then(res=>{
						 	that.pro=res.data.data
						 })
						 teamList(p).then(res=>{
						    that.msglist=res.data.data.teamMessage
						 	that.team= this.sortByType(res.data.data.teamList);
						 	that.lingxian = res.data.data.teamList.filter(item => item.tcType === 0);
						 	that.lianxi = res.data.data.teamList.filter(item => item.tcType === 1);
						 	 that.shengyu = res.data.data.teamList.filter(item => item.tcType !== 0 && item.tcType !== 1);
						 	 console.log(that.lingxian,that.lianxi,that.shengyu)
						 })

					 }else{
						 uni.showToast({
						 	title: res.data.msg,
							icon:'none',
						 	duration: 2000
						 });
					 }
				 })
		  		} else if (res.cancel) {
		  			console.log('用户点击取消');
		  		}
		  	}
		  });

	  },
	  
	  gonumber(){
		  
		  uni.navigateTo({
		  	url:'/pagesB/number/number?id='+this.memberid
		  })
	  },
	  jindu(){
		  
		  uni.navigateTo({
		  	url:'/pagesA/changban/changban?id='+this.memberid
		  })
	  },
	  selectaddress(e){
		  console.log(e)
		  this.pro.memberAddrerss=e.detail.value.join('/')
	  },
	  
	 changeinfo(){
		 this.isread=false
	 },
	 sortByType(array) {
	     if (!Array.isArray(array)) {
	         return '输入必须是一个数组';
	     }
	     
	     // 验证数组中的每个元素都有type属性且值在0-4范围内
	     for (let i = 0; i < array.length; i++) {
	         if (typeof array[i] !== 'object' || array[i] === null) {
	             return '数组元素必须是对象';
	         }
	     
	      
	     }
	     
	     // 创建副本以避免修改原数组
	     const sortedArray = [...array];
	     
	     // 使用Array.sort()方法根据type属性升序排序
	     sortedArray.sort((a, b) => a.tcType - b.tcType);
	     
	     return sortedArray;
	 },
	 

	 
	 saveinfo(){
		 let that=this
		 uni.showModal({
		 	title: '提示',
		 	content: '保存更改',
		 	success: function (res) {
		 		if (res.confirm) {
		 			let p=that.pro
		 			uploadInfo(p).then(res=>{
		 			  console.log(res)
					   if(res.data.code==200){
						     that.isread=true
							 uni.showToast({
							 	title: '修改成功',
								icon:'none',
							 	duration: 2000
							 });
							let a={
								  phone:uni.getStorageSync('phone')
							  }
							getInfo(a).then(res=>{
								console.log(res,'个人信息')
								that.pro=res.data.data.info
							})

					   }
		 			})
					
		 		} else if (res.cancel) {
		 			console.log('用户点击取消');
		 		}
		 	}
		 });

		
		
	 }
  }
}
</script>

<style lang="less" scoped>
   .pagebox{
	   width: 750rpx;
	   box-sizing: border-box;
	 background: linear-gradient(180deg, rgba(242,248,255,1) 0%,rgba(255,255,255,0) 76%);
	   box-sizing: border-box;
	   padding: 20rpx;
	   padding-bottom: 200rpx;
	   .titleline{
		   font-size: 34rpx;
		   font-weight: bold;
		   line-height: 2.8;
		   
	   }
	   .numberline{
		   font-size: 26rpx;
		   font-weight: bold;
		   
	   }
	   .infobox1{
		   width: 100%;
		    border-top: 8rpx solid #1a4f8a; 
		   margin-top: 30rpx;
		   .line{
			   width: 100%;
			   height: 2rpx;
			   background-color: #1a4f8a;
			   margin-top: 4rpx;
		   }
		   .info{
			   width: 100%;
			   display: flex;
			   flex-wrap: wrap;
			   justify-content: space-evenly;
			   .iteminfo{
				   display: flex;
				   align-items: center;
				   font-size: 26rpx;
				   font-weight: bold;
				   line-height: 2.5;
				   width: 33%;
				   justify-content: left;
				  
				   .label{
					    text-align: left;
						width: 120rpx;
				   }
				   .value{
					   color: #1a4f8a ;
					  
				   }
			   }
		   }
	   }
	   .box{
		   width: 100%;
		   margin: 20rpx 0;
		   background-color: white;
		   box-sizing: border-box;
		   padding: 20rpx;
		   .itemline{
			   display: flex;
			   align-items: center;
			    font-weight: bold;
				font-size: 28rpx;
				line-height: 2.4;
			   .label{
				   margin-right: 20rpx;
			   }
			   .value{
				   color: #1a4f8a;
			   }
		   }
		   .boxtitle{
			   font-weight: bold;
			   font-size: 28rpx;
		   }
		   .txt{
			   width: 100%;
			   background-color: whitesmoke;
			   font-weight: bold;
			   font-size: 26rpx;
			   box-sizing: border-box;
			   padding: 20rpx;
		   }
	   }
	   .vipbox{
		   width: 100%;
		   background-color: white;
		   box-sizing: border-box;
		  
		   margin: 20rpx 0;
		   .viptitle{
			   font-weight: bold;
			   border-left: 8rpx solid #1a4f8a;
			   margin: 30rpx ;
			   padding-left: 20rpx;
		   }
		   .vipcontentbox{
			   display: flex;
			   align-items: flex-start;
			   .yuan{
				   width: 80rpx;
				   height: 80rpx;
				   border-radius: 50%;
				   background: whitesmoke;
				   text-align: center;
				   line-height: 80rpx;
				   .iconfont{
					   font-size: 40rpx;
					   color: #1a4f8a;
				   }
			   }
			   .contentbox{
				   flex: 1;
				   font-size: 30rpx;
				   box-sizing: border-box;
				   padding: 20rpx;
				   font-weight: bold;
				   line-height: 2;
				   .name{
					   display: flex;
					   align-items: center;
					   .lever{
						   font-size: 28rpx;
					   }
				   }
				   .line{
					   display: flex;
					   align-items: center;
					   font-size: 26rpx;
					   color: gray;
					   .num{
						   font-size: 32rpx;
						   color: black;
					   }
					   .sheng{
						   font-size: 32rpx;
						   color: red;
					   }
				   }
			   }
			   
		   }
	   }
	   
	   .pagebtn{
		   width: 90%;
		   height: 80rpx;
		   margin: 50rpx auto;
		   text-align: center;
		   border-radius: 40rpx;
		   color: white;
		   line-height: 80rpx;
		   background-color: #1a4f8a;
		   font-size: 28rpx;
	   }
	   
	   .zhuanjia{
	   		 width: 100%;
	   		 display: flex;
	   		 align-items: center;
	   		 background-color: white;
			 margin-top: 30rpx;
	   		 .left{
	   			 width: 180rpx;
	   			 .imgbox{
	   				 width: 110rpx;
	   				 height: 110rpx;
	   				 border-radius: 50%;
	   				 margin: auto;
	   				 image{
	   					 width: 100%;
	   					 height: 100%;
	   					  border-radius: 50%;
	   				 }
	   			 }
	   			 .title{
	   				 width: 110rpx;
	   				 
	   				 height: 40rpx;
	   				 border-radius: 14rpx;
	   				 margin: 20rpx auto;
	   				 font-size: 22rpx;
	   				 color: #A97A00 ;
	   				 background-color: #FFF6DF;
	   			 }
	   			 .title1{
	   			 				 width: 110rpx;
	   			 				 height: 40rpx;
	   			 				 border-radius: 14rpx;
	   			 				 margin: 20rpx auto;
	   			 				 font-size: 22rpx;
	   			 				 color: #259013 ;
	   			 				 background-color: #F3FFEF;
	   			 }
	   		 }
	   		 .infobox{
	   			 line-height: 2;
	   			 .name{
	   				 font-weight: bold;
	   			 }
	   			 .labelline{
	   				 font-size: 28rpx;
	   				 font-weight: bold;
	   			 }
	   			 .typeline{
	   				 display: flex;
	   				 align-items: center;
	   				 font-size: 28rpx;
	   				 .type{
	   					  font-size: 24rpx;
	   					  height: 36rpx;
	   					  line-height: 36rpx;
	   					  margin-right: 20rpx;
	   					 
	   					  border-radius: 10rpx;
	   				 }
	   			 }
	   		 }
	   }
	   .teambox{
	   		width: 100%;
	   		box-sizing: border-box;
	   		padding: 20rpx 0;
	   		border-top: 1rpx solid skyblue;
	   		.teamtitle{
	   			font-weight: bold;
	   			font-size: 30rpx;
	   			margin: 20rpx 0;
	   			
	   		}
	   		.teamline{
	   			width: 100%;
	   			display: flex;
	   			align-items: center;
	   			justify-content: space-evenly;
	   			.item{
	   				width: 20%;
	   				.yuan{
	   					width: 80rpx;
	   					height: 80rpx;
	   					border-radius: 50%;
	   					margin: auto;
	   					image{
	   						width: 100%;
	   						height: 100%;
	   					border-radius: 50%;	
	   					}
	   				}
	   				.work{
	   					font-size: 22rpx;
	   					margin-top: 20rpx;
	   					text-align: center;
	   				}
	   			}
	   		}
	   }
	   .pagetitle{
	   		 font-weight: bold;
	   		 margin: 20rpx 0;
	   }
	   .listbox{
	   		 width: 100%;
	   		 .itemlist{
	   		 			   width: 100%;
	   		 			   background-color: white;
	   		 			   box-sizing: border-box;
	   		 			   display: flex;
	   		 			   padding:30rpx 10rpx;
	   		 			   border-radius: 20rpx;
	   		 			   position: relative;
	   		 			   .imgbox{
	   		 				   width: 100rpx;
	   		 				   height: 100%;
	   		 				   margin-right: 10rpx;
	   		 				   image{
	   		 					   width: 100rpx;
	   		 					   height: 100rpx;
	   		 					   border-radius: 50%;
	   		 				   }
	   		 				   
	   		 			   }
	   		 			   .infobox{
	   		 				  
	   		 				   line-height: 2;
	   		 				   .nameline{
	   		 					   display: flex;
	   		 					   align-items: center;
	   		 					   .name{
	   		 						   font-weight: bold;
	   		 						   margin-right: 20rpx;
	   		 					   }
	   		 					   .listtitle{
	   		 						  
	   		 						   height: 40rpx;
	   		 						   line-height: 40rpx;
	   		 						   background-color:#E4F0FF ;
	   		 						 
	   		 						   color: #1D5A9F ;
	   		 						   font-size: 24rpx;
	   		 						   text-align: center;
	   		 						   padding: 4rpx 10rpx;
	   		 						   border-radius: 10rpx;
	   		 					   }
	   		 					   .title1{
	   		 						   
	   		 						   height: 40rpx;
	   		 						   line-height: 40rpx;
	   		 						   background-color:#00B5CE ;
	   		 						   border: 2rpx solid #E6FCFF;
	   		 						   color: #00B5CE ;
	   		 						      padding: 4rpx 10rpx;
	   		 						   font-size: 24rpx;
	   		 						   text-align: center;
	   		 						   border-radius: 10rpx;
	   		 					   }
	   		 					   .title3{
	   		 					   						      padding: 4rpx 10rpx;
	   		 					   						   height: 40rpx;
	   		 					   						   line-height: 40rpx;
	   		 					   						   background-color:#E9FFE8;
	   		 					   						   border: 2rpx solid #4EB846;
	   		 					   						   color: #4EB846 ;
	   		 					   						   font-size: 24rpx;
	   		 					   						   text-align: center;
	   		 					   						   border-radius: 10rpx;
	   		 					   }
	   		 					   .title4{
	   		 					   						   
	   		 					   						   height: 40rpx;
	   		 					   						   line-height: 40rpx;
	   		 					   						   background-color:#FFFADF ;
	   		 					   						   border: 2rpx solid #B09400;
	   		 					   						   color:#B09400;
	   		 					   						      padding: 4rpx 10rpx;
	   		 					   						   font-size: 24rpx;
	   		 					   						   text-align: center;
	   		 					   						   border-radius: 10rpx;
	   		 					   }
	   		 				   }
	   		 				   .hospitalline{
	   		 					   display: flex;
	   		 					   align-items: center;
	   		 					   font-size: 30rpx;
	   		 					   .leve{
	   		 						   
	   		 						   height: 40rpx;
	   		 						   line-height: 40rpx;
	   		 						   background-color:#E6FCFF ;
	   		 						  
	   		 						   color: #00B5CE;
	   		 						   font-size: 24rpx;
	   		 						   text-align: center;
	   		 						   border-radius: 10rpx;
	   		 					   }
	   		 				   }
	   		 				   .labelline{
	   		 					   display: flex;
	   		 					   align-items: center;
	   		 				   }
	   		 				   
	   		 			   }
	   		 			   .type{
	   		 				   position: absolute;
	   		 				   right: 0;
	   		 				   top: 50rpx;
	   		 				   padding: 6rpx 10rpx;
	   		 				   text-align: center;
	   		 				   font-size: 20rpx;
	   		 				   font-weight: bold;
	   		 				   background-color:#E9E9E9;
	   		 				   border-top-left-radius: 10rpx;
	   		 				   border-bottom-left-radius: 10rpx;
	   		 			   }
	   		 }
	   }
	   
	   .msgbox{
		   width: 100%;
		   box-sizing: border-box;
		   padding: 20rpx;
		   background-color: white;
		   margin-top: 30rpx;
		   .msgtitle{
			   font-weight: bold;
		   }
		   .msglist{
			   width: 100%;
			   margin-top: 20rpx;
			   .itemmsglist{
				   width: 100%;
				   font-size: 32rpx;
				   background-color: #cccccc;
				   display: flex;
				   align-items: center;
				   padding:12rpx 18rpx;
				   margin-top: 20rpx;
			   }
			   input{
				   width: 100%;
				   font-size: 32rpx;
				   background-color: #cccccc;
				   display: flex;
				   align-items: center;
				  padding:12rpx 18rpx;
				    margin-top: 20rpx;
			   }
			   .addmsg{
				   width: 100%;
				   font-size: 30rpx;
				   background-color: #1a4f8a;
				   color: white;
				 
				   padding:18rpx 10rpx;
				    margin-top: 20rpx;
					text-align: center;
					font-weight: bold;
			   }
		   }
	   }
	   
	   
	   .foottabbar{
	   		  width: 750rpx;
	   		  position: fixed;
	   		  background-color: white;
	   		  height: 150rpx;
	   		  bottom: 0;
	   		  left: 0;
	   		  display: flex;
	   		  align-items: center;
	   		  justify-content: space-evenly;
	   		  z-index: 999;
	   	
	   		  .itemfoot{
	   			  border: 1rpx solid #1a4f8a;
	   			  color: #1a4f8a;
	   			  max-height: 70rpx;
	   			  box-sizing: border-box;
	   			  border-radius: 35rpx;
	   			  line-height: 70rpx;
	   			  padding: 0 26rpx;
	   			  
	   		  }
	   		  .footact{
	   		  			  background-color: #1a4f8a !important;
	   		  			  color: white !important;
	   		  }
	   }
	  
	  
   }
</style>
